<style>
body {
  min-width:440px;
  overflow-x:hidden;
  font: 13px "lucida grande",tahoma,verdana,arial,sans-serif;
  color: #666;
}
a {
  color: #4B93BC;
  text-decoration: none;
}
a:visited, a:hover {
  color: #347194;
}
a:hover {
  text-decoration: underline;
}
ul {
  margin-top: 3px;
  padding-left: 0;
  margin-left: 0;
}
li {
  margin: 0;
  padding: 0.15em;
  border-bottom: 1px dashed #DDD;
  margin-bottom: 2px;
  padding-bottom: 2px;
  list-style-type: none;
}
li.new {
  background-color: #E0F4D0;
}
small.date {
  font-size:9px;
}
div#footer {
  margin: 0;
  padding: 0;
  font-size: 10px;
  background-color: #DDD;
  color: #444;
}
</style>

<img src="icon_48x48.png" style="vertical-align:middle" /> <strong>TamTamy's History</strong></td>

<ul id="lista">
</ul>
<div id="footer"><a href="http://www.tamtamy.com" target="_blank"><strong>TamTamy</strong></a><br />Since 2007, helping businesses design and develop tools and practices of Social Media.</div>

<script>
var req = new XMLHttpRequest();
var timestamp = new Date().getTime();
req.open(
    "GET",
    chrome.extension.getBackgroundPage().TT_URL+"/tamtamy/api/notice.xml?t="+timestamp,
    true);
req.onload = showNotices;
req.send(null);

function showNotices() {
	var lista = document.getElementById("lista");
	if (req.status=="401") {
		var oNewNode = document.createElement("li");
		oNewNode.innerHTML="<a href='"+chrome.extension.getBackgroundPage().TT_URL+"' target='_blank'>Please, login to TamTamy</a>";
		lista.appendChild(oNewNode);
	} else if (req.status=="200") {
		chrome.browserAction.setBadgeText({text:""});
		var previousNoticeId=localStorage["TT_LAST_READ_NOTICE_ID"];
		var notices = req.responseXML.getElementsByTagName("it.reply.tt.rest.entity.KcLNotice");
		for (var i = 0, notice; notice = notices[i]; i++) {
			var noticeId = notice.getElementsByTagName("id")[0].childNodes[0].nodeValue;
			var title = notice.getElementsByTagName("title")[0].childNodes[0].nodeValue;
			var permalink = notice.getElementsByTagName("permalink")[0].childNodes[0].nodeValue;
			var dateStr = notice.getElementsByTagName("created")[0].childNodes[0].nodeValue;
			var oNewNode = document.createElement("li");
			if (noticeId>previousNoticeId) {
				oNewNode.setAttribute('class', 'new');
			}
			oNewNode.innerHTML="<a href='"+permalink+"' target='_blank'>"+title+"</a><br /><small class='date'>"+dateStr+"</small>";
			lista.appendChild(oNewNode);
			if (!localStorage["TT_LAST_READ_NOTICE_ID"] || noticeId > localStorage["TT_LAST_READ_NOTICE_ID"]) {
				localStorage["TT_LAST_READ_NOTICE_ID"]=noticeId;
			}
		}
	} else {
		var oNewNode = document.createElement("li");
		oNewNode.innerHTML="API Error: " + req.status;
		lista.appendChild(oNewNode);
	}
}
</script>